<template>
	<div >
		<el-dialog v-model="isShowDialog" title="点位数据" :width="1200" draggable="" @open="handleQuery">
			<div >
        		<el-card shadow="hover" :body-style="{ paddingBottom: '0' }">
        					<el-form :model="queryParams" ref="queryForm" :inline="true">
        						<el-row :gutter="35">
        						  
        			            <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" >
        			              <el-form-item label="点位名称">
        			              <el-input v-model="queryParams.condition" clearable placeholder="点位名称"/>
        			              </el-form-item>
                                </el-col> 
        			         
                
        			          <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20 search-actions">
         
        			          <div>
        			          <el-button icon="ele-Refresh" @click="() => queryParams = {}"> 重置 </el-button>
        			          <el-button type="primary" plain icon="ele-Search" @click="handleQuery" v-auth="'unitCv:page'"> 查询 </el-button>
        			          </div>
        			          </el-col>
        			      </el-row>
        			      </el-form>
        	   </el-card>
        		<el-card shadow="hover" style="margin-top: 8px">
        			<el-table
        				:data="tableData"
        				style="width: 100%"
        				v-loading="loading"
        				tooltip-effect="light"
        				row-key="id"
        				border="">
        				<el-table-column type="index" label="序号" width="55" align="center" fixed="" />
        				 <el-table-column prop="tagNumber" label="站台号" width="100" show-overflow-tooltip="" />
        				 <el-table-column prop="tagProperty" label="点位名称" width="180" show-overflow-tooltip="" />
                         <el-table-column prop="address" label="地址" width="100" show-overflow-tooltip="" />
        				 <el-table-column prop="readWrite" label="读写" width="100" show-overflow-tooltip="" 
        					 :filters="[
        					     { text: '只读', value: 0 },
        					     { text: '只写', value: 1 },
                                 { text: '读写', value: 2 }
        					 ]"
        	      :filter-method="filterWrite"
        	      filter-placement="bottom-end">
        		  <template #default="scope">
        				        <el-tag
        				          :type="scope.row.readWrite === 0  ? 'success' : 'info'"
        				          disable-transitions >{{ scope.row.readWrite ===0 ? '只读' : scope.row.readWrite ===1?'只写':'读写' }}
        						</el-tag>
        				      </template>
        		</el-table-column>

                <el-table-column prop="dataType" label="值类型" width="100" show-overflow-tooltip=""  />
                <el-table-column prop="dataTypeInfo" label="长度" width="100" show-overflow-tooltip="" />
                <el-table-column prop="dbBlock" label="DB" width="100" show-overflow-tooltip="" />

        		  <el-table-column prop="value" label="当前值" width="100" show-overflow-tooltip="" />
        		  <el-table-column prop="oldValue" label="历史值" width="100" show-overflow-tooltip="" />
        		  <el-table-column prop="regTime" label="时间"  show-overflow-tooltip="" />
        		  
        				
				  
        				
        			</el-table>
			
        			
        		</el-card>
        	</div>
			<template #footer>
				<span class="dialog-footer">
					<el-button @click="cancel" size="default">取 消</el-button>				
				</span>
			</template>
		</el-dialog>
	</div>
</template>

<script lang="ts" setup>
	import { ref,onMounted } from "vue";
	import { ElMessage } from "element-plus";
	import type { FormRules } from "element-plus";
	import { getUnitCv,getUnitSc } from '/@/api/main/grpcServer';
import { number } from "echarts";

    var props = defineProps({
	tagtype:String,
	tagnumber: {
	type: Number,
	default: 0,
	},

	
	
	});

    const queryParams = ref<any>({
        condition:''
    });

	
	const isShowDialog = ref(false);
	

    
    const loading = ref(false);
    const tableData = ref<any>([]);
    	// 查询操作
	const handleQuery = async () => {
    loading.value = true;

    let para = {
        tagNumber: props.tagnumber,
        isShowAllTag: 1

    };
	let datas:any[]=[];
	if(props.tagtype=='cv'){
		var res = await getUnitCv(para);
	datas=res.data.result[0].tagList;

	}
	else if(props.tagtype=='sc'){

		var res = await getUnitSc(para);
	datas=res.data.result[0].tagList;
	}
   
   
   

    if(datas && queryParams.value ){
		datas=datas.filter((x)=>{
			return x.tagProperty.includes(queryParams.value.condition);
		})
	}
	tableData.value = datas;
	
    loading.value = false;
};


// 打开弹窗
const openDialog = async() => {
  
  isShowDialog.value = true;
  tableData.value=[];
 
};



const filterWrite = (value: number, row: any) => {
  return row.readWrite==value;
}


// 关闭弹窗
const closeDialog = () => {
  
  isShowDialog.value = false;
};

// 取消
const cancel = () => {
  isShowDialog.value = false;
};





// 页面加载时
onMounted(async () => {
    // 
});

//将属性或者函数暴露给父组件
defineExpose({ openDialog });
</script>




